<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>iFrame异步文件上传</title> 
</head> 
<body> 
<h1>iFrame异步文件上传</h1> 
<form method="post" enctype="multipart/form-data"> 
  用户名: <input type="text" name="username" /><br /> 
  上传头像: <input type="file" name="uploadphoto" onchange="startUpload(this.form)" /> 
  <iframe style="display:none" mce_style="display:none" name="uploadframe"></iframe> 
  <input type="hidden" id="photo" name="photo" value="" /> 
  <div id="displayphoto"></div> 
  <input type="submit" name="submitted" value="提交" onclick="formSubmit(this.form)" /> 
</form> 
<?php  
//页面提交后显示相关信息 
if (isset($_POST['submitted'])) { 
  $html = '<hr /><p>上传成功！</p>'; 
  $html .= '<p>用户名：'.htmlspecialchars($_POST['username']).'</p>'; 
  $html .= '<p>头像地址：'.htmlspecialchars($_POST['photo']).'</p>'; 
  $html .= '<div><img src="'.htmlspecialchars($_POST['photo']).'" mce_src="'.htmlspecialchars($_POST['photo']).'" /></div><hr />'; 
  echo $html; 
} 
?> 
</body> 
</html> 
<script type="text/javascript">
function startUpload(oForm) { 
  document.getElementById('displayphoto').innerHTML = 'Loading...'; 
  oForm.action = 'proceedupload.php'; 
  oForm.target = 'uploadframe'; 
  oForm.submit(); 
} 
function formSubmit(oForm) { 
  oForm.action = document.URL; 
  oForm.target = '_self'; 
  oForm.submit(); 
} 
<script> 